<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>列表+表单+新元素</title>
	</head>
	<body>
		<h1>列表元素</h1>
		<!--无序列表-->
		<ul>
			<li>1</li>
			<li>2</li>
			<li>3</li>
		</ul>
		<!--无序列表-->
		<ol>
			<li>2</li>
			<li>4</li>
			<li>6</li>
		</ol>
		<!--定义列表用来解释小图片-->
		<dl>
			<dt><img src="img/愚人节背景图片-大图_爱给网_aigei_com.jpg" height="100px" /></dt>
			<dd>这是便便神器</dd>
		</dl>
		<h1>表单元素</h1>
		<!--采集用户信息，登录，button是按钮  submit是提交 reset是重置 要用form包起来-->
		<form action="">
		账号：<input type="text">
		密码：<input type="password">
		<button>按钮</button>
		<input type="submit">
		<input type="reset">
		<!--radio用来做勾选（单选）  checkbox用来做多选-->
		男 <input type="radio" name="sex">
		女 <input type="radio" name="sex">
		肉 <input type="checkbox">
		菜 <input type="checkbox">
		堂 <input type="checkbox">
		</form>
		<h1>新元素</h1>
		<!--记号笔元素-->
		lorem <mark>lorems</mark>
		<!--度量元素-->
		<meter value="60" max="1"></meter>
		<!--细节元素-->
		<details>
			<summary>默认显示效果</summary>
			<div>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex, excepturi beatae dicta molestias doloribus facilis laudantium, fugiat officiis sint quo aperiam nulla voluptatibus magnam quibusdam voluptatem cupiditate? Nihil, sunt! <Non class="lorem"></Non></div>
		</details>
	</body>
</html>